<template>
  <!-- 添加或修改跟单类型对话框 -->
  <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
    <el-form ref="followTypeFormRef" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="类型名称" prop="typeName">
        <el-input v-model="form.typeName" placeholder="请输入类型名称" />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import { addFollowType, updateFollowType } from '@/api/goods/followType';
export default {
  data() {
    return {
      dialog: {
        title: '添加经营类型',
        visible: false
      },
      form: { id: null, typeName: '' },
      rules: {
        typeName: [{ required: true, message: '类型名称不能为空', trigger: 'blur' }]
      },
      buttonLoading: false
    };
  },
  methods: {
    /** 提交按钮 */
    submitForm() {
      const success = () => {
        this.buttonLoading = false;
        this.$emit('ok');
        this.cancel();
      };
      this.$refs.followTypeFormRef.validate((valid) => {
        if (valid) {
          this.buttonLoading = true;
          try {
            if (this.form.id) {
              updateFollowType(this.form)
                .then((res) => {
                  if (res.code == 200) {
                    success();
                  }
                })
                .catch((e) => {
                  console.log(e);
                  this.buttonLoading = false;
                });
            } else {
              addFollowType(this.form)
                .then((res) => {
                  if (res.code == 200) {
                    success();
                  }
                })
                .catch((e) => {
                  console.log(e);
                  this.buttonLoading = false;
                });
            }
          } catch (e) {
            console.log(e);
            this.buttonLoading = false;
          }
        }
      });
    },
    add(row) {
      this.form = { id: null, typeName: '',
        typeCategory: row.typeCategory,
 };
      this.dialog.title = '添加跟单类型';
      this.dialog.visible = true;
    },
    edit(row) {
      this.form = { ...row };
      this.dialog.title = '修改跟单类型';
      this.dialog.visible = true;
      this.$refs.followTypeFormRef.clearValidate();
    },
    cancel() {
      this.dialog.visible = false;
    }
  }
};
</script>

<style lang="scss" scoped>
</style>